import React, { Component } from 'react'

export default class App extends Component {
    state = {
        username: "Jayden"
    }
    render() {
        return (
            <div>
                {/*非受控组件 */}
                {/* <h1>登录页</h1>
                <input ref={this.textRef} defaultValue="Jayden"/>
                <button onClick={() => {
                    console.log(this.textRef.current.value);
                }}>登录</button>
                <button onClick={() => {
                    this.textRef.current.value = ""
                }}>重置</button> */}

                <h1>登录页</h1>
                <input value={this.state.username} onChange={(evt) => {
                    this.setState({ username: evt.target.value })
                }} />
                <button onClick={() => {
                    console.log(this.state.username);
                }}>登录</button>
                <button onClick={() => {
                    this.setState({
                        username : ""
                    })
                }}>重置</button>
            </div>
        )
    }
}
